<template>
	<view class="lunbo">
			<view class="lunbo_t" v-for="(itam,index) in lunbo" :class="index===lunbo.length-1?'box2':''">
				<text>{{itam.wz}}</text>
				<view class="lunbo_b">
					 <scroll-view :scroll-x="true" style="white-space: nowrap;">
							 <view class="box1" v-for="(itam1,index1) in itam.src">
								 <image :src="itam1.url" mode=""></image>
								 <text>{{itam1.bt}}</text>
							</view>
					 </scroll-view>
				</view>
			</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
				lunbo:[
					{
						src:[
							{
								url:"../../static/banner/l1.png",
								bt:"辛亥革命时期"
							},
							{
								url:"../../static/banner/l1.png",
								bt:"辛亥革命时期"
							},
							{
								url:"../../static/banner/l1.png",
								bt:"辛亥革命时期"
							},
							{
								url:"../../static/banner/l1.png",
								bt:"辛亥革命时期"
							}
						],
						wz:"全景思政"
					},
					{
						src:[
							{
								url:"../../static/banner/l1.png",
								bt:"辛亥革命时期"
							},
							{
								url:"../../static/banner/l1.png",
								bt:"辛亥革命时期"
							},
							{
								url:"../../static/banner/l1.png",
								bt:"辛亥革命时期"
							},
							{
								url:"../../static/banner/l1.png",
								bt:"辛亥革命时期"
							}
						],
						wz:"VR思政"
					},
					{
						src:[
							{
								url:"../../static/banner/l2.png",
								bt:"辛亥革命时期"
							},
							{
								url:"../../static/banner/l2.png",
								bt:"辛亥革命时期"
							},
							{
								url:"../../static/banner/l2.png",
								bt:"辛亥革命时期"
							},
							{
								url:"../../static/banner/l2.png",
								bt:"辛亥革命时期"
							}
						],
						wz:"教学资源"
					}
				]
			}
		},
		methods: {
			
			
		}
		
	}
</script>

<style>
	.lunbo_b{
		margin-top: 20upx;
		margin-bottom: 20upx;
	}
	.lunbo_z view{
		width: 250upx;
	}
	.lunbo_t>text{
		font-size: 30upx;
		padding-left: 20upx;
	}
	.box2 .box1{
		width: 201upx;
		box-shadow: none;
	}
	.box2 .box1 image{
		height: 266upx;
	}
		.box1 {
	        display: inline-block;
	        width: 252upx;
	        background: #FFFFFF;
			border-radius: 10upx;
			overflow: hidden;
			box-shadow:0px 1px 8px #D9D9D9;
			margin: 0 20upx 0 20upx;
	    }
		.box1>image{
			height: 163upx;
		}
		.box1>text{
			display: block;
			text-align: center;
			font-size: 26upx;
			padding-bottom: 15upx;
		}
</style>